<template>
  <el-form-item label="请选择省市区">
    <s-select-group
      v-model="cascaderValue"
      :len="3"
      :options="regionData"
      @change="handleChange"
    />
  </el-form-item>
  <br />
</template>
<script lang="ts" setup>
import { regionData, codeToText } from 'element-china-area-data'
import { ref } from 'vue'
defineOptions({
  name: 'pro-select-group',
})

const cascaderValue = ref(['11', '1101', '110101'])

function handleChange() {
  console.log(cascaderValue.value)
  console.log(
    codeToText[cascaderValue.value[0]],
    codeToText[cascaderValue.value[1]],
    codeToText[cascaderValue.value[2]],
  )
}
</script>
